import React, { Component } from 'react';
import PropTypes from 'prop-types'
import Item from '../Item';
import './index.css'

class List extends Component {

  // eslint-disable-next-line react/no-typos
  static propTypes = {
    todos:PropTypes.array.isRequired,
    updateTodo:PropTypes.func.isRequired,
    deleteTodo:PropTypes.func.isRequired
  }

  render() {
    const {todos, updateTodo, deleteTodo} =this.props
    return (
      <ul className="todoMain">
        {
          todos.map((todo)=> {
            return <Item key={todo.id} {...todo} updateTodo={updateTodo} deleteTodo={deleteTodo}/>
          })
        }
      </ul>
    );
  }
}

export default List;